<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<title>群聚网</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="generator" content="" />
<meta name="copyright" content="群聚网" />
<meta name="author" content="yilian, www.yilian.cc" />
<meta name="robots" content="index, follow" />
<meta name="googlebot" content="index, follow" />
<link href="/css/global.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/js/jquery-1.4.4.min.js"></script>
<script src="/js/formValidator-4.1.0.js" type="text/javascript" charset="UTF-8"></script>
<script src="/js/formValidatorRegex.js" type="text/javascript" charset="UTF-8"></script>
<script type="text/javascript">
String.prototype.trim = function() {
	return this.replace(/^\s+|\s+$/g, "");
}
$(document).ready(function() {	
	//第一组校验组，默认组号为"1"form1
   $.formValidator.initConfig({formID:"rForm",debug:false,submitOnce:true,
		onError:function(msg,obj,errorlist){
		$("#errorlist").empty();
		$.map(errorlist,function(msg){
			$("#errorlist").append("<li>" + msg + "</li>")
		});
		alert(msg);
	},
	submitAfterAjaxPrompt : '有数据正在异步验证，请稍等...',
	onShowClass : "",
	onFocusClass : "",
	onCorrectClass : ""
});
	$("#username").formValidator({onShow:"用户名至少3个汉字，最多10个汉字",onFocus:"用户名至少3个汉字，最多10个汉字",onCorrect:"该用户名可以注册"}).inputValidator({min:6,max:20,onError:"用户名至少3个汉字，最多10个汉字"})//.regexValidator({regExp:"username",dataType:"enum",onError:"用户名格式不正确"})
    .ajaxValidator({
	dataType : "text",
	async : true,
	url : "/userRegister.do?method=findNameIs",
	success : function(data){
		if(data==1){
			return false;
		}
		if(data==0){
			return true;
		}
			return true;
	}, 
	error: function(jqXHR, textStatus, errorThrown){alert("服务器没有返回数据，可能服务器忙，请重试"+errorThrown);},
	onError : "该昵称已注册，请更换昵称",
	onWait : "正在对用户名进行合法性校验，请稍候..."
});

   $("#password1").formValidator({onShow:"请输入会员密码",onFocus:"密码长度至少6个英文或数字",onCorrect:"密码合法"}).inputValidator({min:5,empty:{leftEmpty:false,rightEmpty:false,emptyError:"密码两边不能有空符号"},onError:"密码不能为空并且至少为6个英文或数字"});
	$("#password2").formValidator({onShow:"再次输入密码",onFocus:"密码长度至少6个英文或数字",onCorrect:"密码一致"}).inputValidator({min:5,empty:{leftEmpty:false,rightEmpty:false,emptyError:"重复密码两边不能有空符号"},onError:"重复密码不能为空并且至少为6个英文或数字"}).compareValidator({desID:"password1",operateor:"=",onError:"2次密码不一致,请确认"});

	$("#useremail").formValidator({onShow:"您有效的电子邮箱，用于和您及时沟通，绝不公开",onFocus:"邮箱6-50个字符",onCorrect:"恭喜你,邮箱输入正确",defaultValue:""}).inputValidator({min:6,max:100,onError:"你输入的邮箱长度非法,请确认"}).regexValidator({regExp:"^([\\w-.]+)@(([[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.)|(([\\w-]+.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(]?)$",onError:"你输入的邮箱格式不正确"})
	 .ajaxValidator({
	dataType : "text",
	async : true,
	url : "/userRegister.do?method=findEmailIs",
	success : function(data){
		if(data==1){
			return false;
		}
		if(data==0){
			return true;
		}
			return true;
	},
	error: function(jqXHR, textStatus, errorThrown){alert("服务器没有返回数据，可能服务器忙，请重试"+errorThrown);},
	onError : "该昵称已注册，请更换昵称",
	onWait : "正在对用户名进行合法性校验，请稍候..."
	});
	$(":radio[name='type']").formValidator({tipID:"typeTip",onShow:"请选择你的用户类型",onFocus:"请选择你的用户类型",onCorrect:"输入正确",defaultValue:["10"]}).inputValidator({min:1,max:1,onError:"请选择用户类型"});//.defaultPassed();	
});

//注册表单提交
function submitPersonal(){
	var email  = $("#useremail").val();
	var allow = true;
	if(email!=""){
		//检查验证码
	    if(!validateCaptcha("#cap")){
				allow = false;
			}
		if(allow){
			$("#rForm").submit();
		}
	 }
}

//验证验证码
function validateCaptcha(captchaSelector){	
		$(captchaSelector).attr("ovalue", $(captchaSelector).val());
	//如果之前ajax验证过,则无需再次验证,直接返回
	//if($(captchaSelector).attr("ajaxValidated") != undefined){return true;}
	var reg = /^\d{4}$/;
	if(reg.test($(captchaSelector).attr("ovalue")) || reg.test($(captchaSelector).val())){
		//ajax验证,设置async为false会锁住浏览器
		var feed_back = 
			$.ajax({
				url: "/userRegister.do?method=getyanzheng",
				cache: false,
				async: false,
				error: function(datas){
					$(captchaSelector).val("网络错误,请刷新网页");
					//setValidateTextResultError(captchaSelector);
					return false;
				}
			}).responseText;
		if($(captchaSelector).val().trim()!= feed_back){
			alert("数字错误");
		}else{
			$(captchaSelector).attr("ajaxValidated", "1");
		}
		if($(captchaSelector).attr("ajaxValidated") != undefined){
			return true;
		}else{
			return false;
		}
	}else{
		$(captchaSelector).val("格式错误");
		return false;
	}
}

function changeImg(){         
	var imgSrc = $("#checkImg");         
	var src = imgSrc.attr("src"); 
//	alert(src);        
	imgSrc.attr("src",chgUrl(src));
	//imgSrc.attr("src",src);        
	 }    
	//时间戳     //为了使每次生成图片不一致，即不让浏览器读缓存，所以需要加上时间戳     
	function chgUrl(url){         
		var timestamp = (new Date()).valueOf();         
		urlurl = url.substring(0,28);  
		//alert(urlurl);       
		if((url.indexOf("?") >= 0)){             
			   urlurl = url + "&t=" + timestamp;
			}else{             
				 urlurl = url + "?t=" + timestamp;
				}   
	//	 alert(urlurl);         
		 return urlurl; 
				} 
	function callback(data) {
		     $("#info").html(data);
		 }


	 function set_zlist(aid){
			$.post("/userRegister.do?method=getzList",{aid:aid},
					function(data){
			  		    var id = document.getElementById("cityAdress");
				        while (id.childNodes.length > 0) {   
				            id.removeChild(id.childNodes[0]);
				        }
					$.each(data, function(i, item) {
			        $("#cityAdress").append("<option value="+item.id+">"+item.adressName+"</option>");
			        });
					},"json");
	}	
</script>
</head>

<body>
<%@ include file="/hader.jsp"%> 
<div class="wrapper">
	<div class="cb"></div>
	<div class="registration">
		<div class="left fl">
			<h2>欢迎注册群聚网</h2>
			  <form action="/userRegister.do?method=register" method="post" name="rForm" id="rForm" enctype="multipart/form-data" >
			<div>
				<table cellpadding="0" cellspacing="0" width="100%" border="0">
					<tr>
						<td width="23%" align="right" valign="top">用户类型：</td>
						<td width="77%" align="left" valign="top">
							<input  name="type" id="t1" value="0" type="radio"/>
							个人账户&nbsp;&nbsp;&nbsp;&nbsp;
							<input  name="type" id="t2" value="1" type="radio" />
							商家账户<br />
							<span>如果您想参与活动，请选择"个人账户"，如果您是商家，想发布套餐，请选择"商家账户"</span></td>
					</tr>
					<tr>
						<td align="right" valign="top">用户名：</td>
						<td align="left" valign="top"><input id="username" name="username"  type="text" />
					
							<br />
								<span id="usernameTip" ></span></td>
							
					</tr>
					<tr>
						<td align="right" valign="top">邮箱：</td>
						<td align="left" valign="top">
						<input id="useremail" name="useremail" type="text" />
						<br />
						<span id="useremailTip" ></span>
						</td>	
							
					</tr>
					<tr>
						<td align="right" valign="top">密码：</td>
						<td align="left" valign="top"><input id="password1" name="pwd" type="password" />
							<br />
							<span id="password1Tip"></span></td>
					</tr>
					<tr>
						<td align="right" valign="top">确认密码：</td>
						<td align="left" valign="top"><input  id="password2" name="pwd2" type="password" />
							<br />
							<span id="password2Tip"></span></td>
					</tr>
					<tr>
						<td align="right" valign="top">省市：</td>
						<td align="left" valign="top">
							<select id="fselect" name="fselect" onchange="set_zlist(this.value);" class="input1 w128 h20">
							<c:forEach items="${flist}" var="flist" >
                     			<option value="${flist.id}">${flist.adressName}</option>
                     		</c:forEach>
							</select>
							&nbsp;&nbsp;&nbsp;&nbsp;
							<select id="cityAdress" name="cityAdress" style="width:200px;" path="businessinfo.cityAdress" class="input1 w128 h20">
								<c:forEach items="${zlist}" var="zlist" >
                     				<option value="${zlist.id}">${zlist.adressName}</option>
                     			</c:forEach>
						</select>
							<br />
							<span>请选择城市</span></td>
					</tr>
					<tr>
						<td align="right" valign="top">验证码：</td>
						<td align="left" valign="top"><input id="cap" name="captcha"  type="text" style="height:26px" />
							&nbsp;&nbsp;<a href="javascript:changeImg();">
								<img id="checkImg" src="/userRegister.do?method=yanzheng"/>&nbsp;&nbsp;看不清? 
							</a><br />
							<span>请输入图片中的字符</span></td>
							<td id="info"></td> 
					</tr>
					<tr>
						<td align="right" valign="top">&nbsp;</td>
						<td align="left" valign="top"><input id="button" name="input3" type="button"  value="注&nbsp;&nbsp;册" onclick="submitPersonal()" class="btn02" /></td>
					</tr>
				</table>
			</div>
			</form>
		</div>
		<div class="right fr">我已经是群聚网会员，请<a href="/login.do?method=view">登录</a></div>
		<div class="cb"></div>
	</div>
	<div class="cb"></div>
</div>
<%@ include file="/footer.html"%> 
</body>
</html>
